import { listenToKeyboardEvents } from 'react-native-keyboard-aware-scroll-view';
import { ScrollView } from 'react-native';

const KeyboardAwareScrollView = listenToKeyboardEvents((props) => <ScrollView {...props} />);

import React from 'react'
import {
  ScrollView,
  KeyboardAvoidingView,
} from 'react-native'
import PropTypes from 'prop-types'

function KeyboardAwareScrollView (props) {
  const {
    behavior,
    children,
    ...rest
  } = props

  return (
    <KeyboardAvoidingView behavior={behavior}>
      <ScrollView
        keyboardShouldPersistTaps='handled'
        {...rest}
      >
        {children}
      </ScrollView>
    </KeyboardAvoidingView>
  )
}

KeyboardAwareScrollView.propTypes = {
  behavior: PropTypes.string.isRequired,
  children: PropTypes.any.isRequired,
}

KeyboardAwareScrollView.defaultProps = {
  behavior: 'position',
}

export default KeyboardAwareScrollView

Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.

npm i @codler/react-native-keyboard-aware-scroll-view

import React from 'react';
import { 
    ScrollView,
    KeyboardAvoidingView,
    TextInput, StyleSheet,
    Text,
    Platform,
    Button,
    Keyboard
} from 'react-native';

const KeyboardAvoidingComponent = () => {
  return (
    <KeyboardAvoidingView
      behavior={Platform.OS == "ios" ? "padding" : "height"}
      style={styles.container}
    >
      <ScrollView keyboardShouldPersistTaps="handled">
        <View style={styles.inner}>
          <Text style={styles.header}>Header</Text>
          <TextInput placeholder="Username" style={styles.textInput} />
          <View style={styles.btnContainer}>
            <Button title="Submit" onPress={() => null} />
          </View>
        </View>
      </TouchableWithoutFeedback>
    </KeyboardAvoidingView>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  inner: {
    padding: 24,
    flex: 1,
    justifyContent: "space-around"
  },
  header: {
    fontSize: 36,
    marginBottom: 48
  },
  textInput: {
    height: 40,
    borderColor: "#000000",
    borderBottomWidth: 1,
    marginBottom: 36
  },
  btnContainer: {
    backgroundColor: "white",
    marginTop: 12
  }
});

export default KeyboardAvoidingComponent;